<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Halftone Navigation Menu With jQuery &amp; CSS3 | Tutorialzine demo</title>

<link rel="stylesheet" type="text/css" href="styles.css" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript" src="script.js"></script>

</head>

<body>

<h1>Halftone Navigation Menu With jQuery &amp; CSS3</h1>
<h2>View the <a href="http://tutorialzine.com/2010/01/halftone-navigation-menu-jquery-css/">original tutorial &raquo;</a></h2>


<div id="main">
	
 <div id="navigation">
     <ul class="menuUL">
	     <!-- The class names that are assigned to the links correspond to name of the shape that is shown on hover: -->
         <li><a href="#" class="house">Home</a></li>
         <li><a href="#" class="wrench">Services</a></li>
         <li><a href="#" class="envelope">Contact</a></li>
         <li><a href="#" class="info">About</a></li>
     </ul>
     <div class="clear"></div>
 </div>

    <div id="stage">
    <!-- The dot divs are shown here -->
    </div>
</div>

<p class="tutInfo">This is a tutorialzine demo. View the <a href="http://tutorialzine.com/2010/01/halftone-navigation-menu-jquery-css/">original tutorial</a>, or download the <a href="demo.zip">source files</a>.</p>


</body>
</html>
